import { Component } from 'react';
import './index.less'
import { Toast } from 'react-vant';
class Nav extends Component {
    state = {
        activeIndex:0
    }
    render() {
        let {activeIndex} = this.state;
        return (
            <div className="nav">
                {
                    this.props.tabList.map((item, index) => {
                        return (
                            <div key={index} className='nav_item' onClick={()=>{
                                Toast.loading({
                                    message: '加载中...',
                                    forbidClick: true,
                                  })
                                this.setState({
                                    activeIndex:index
                                })
                                this.props.getType(item.type)
                            }}>
                                <div className={activeIndex === index?'avtive_name':''}>
                                { item.name }
                                </div>
                                <div className={activeIndex === index?'tag active_tag':'tag'}>
                                { item.info }
                                </div>
                            </div>
                        )
                    })
                }
            </div>
        )
    }
}
export default Nav